<div id="projectModal"
     class="modal fade"
     role="dialog"
     aria-labelledby="projectModalLabel"
     aria-modal="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header d-flex align-items-center">
        <h4 id="projectModalLabel" class="modal-title flex-grow-1 text-center">
          <%= t("user.circuitverse.preview_project", default: "Preview Project") %>
        </h4>
        <button type="button"
                class="btn-close ms-auto"
                data-bs-dismiss="modal"
                aria-label="<%= t('contest.close') %>"></button>
      </div>

      <div class="modal-body">
        <div class="ratio ratio-4x3 feature feature-preview users-iframe-container">
          <iframe src=""
                  id="project-iframe-preview"
                  webkitAllowFullScreen
                  mozAllowFullScreen
                  allowFullScreen></iframe>
        </div>
      </div>

      <div class="modal-footer">
        <%= link_to t("more", default: "More"),
                    "#",
                    class: "btn primary-button",
                    id: "project-more-button",
                    target: "_blank" %>
      </div>
    </div>
  </div>
</div>
